<?php /*a:2:{s:52:"D:\phpstudy_pro\WWW\kaifaposs1\view\index\index.html";i:1597715186;s:53:"D:\phpstudy_pro\WWW\kaifaposs1\view\index\socket.html";i:1597714460;}*/ ?>
<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <link rel="stylesheet" href="/static/css/app.css">

    <title>Hello, world!</title>
</head>
<style>
    .hidden {
        display: none;
    }
</style>

<body>
    <div class="container-fluid" id="container">
        <div class="row" style="height: 100%;">
            <div class="col-sm-3">
                <div class="jumbotron" style="margin:0;height: 100%;">
                    <ul class="list-group list-group-flush">
                        <?php if(is_array($list) || $list instanceof \think\Collection || $list instanceof \think\Paginator): $i = 0; $__LIST__ = $list;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
                        <li class="list-group-item " style="background:none;"><?php echo htmlentities($vo); ?></li>
                        <?php endforeach; endif; else: echo "" ;endif; ?>
                    </ul>
                </div>
            </div>
            <div class="col-sm-9" style="padding-left:0">
                <div class="row">
                    <div class="col-sm">
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item active" aria-current="page" id="home">Home</li>
                            </ol>
                        </nav>
                    </div>
                </div>
                <div class="row" style="height: calc(100% - 63px);position: relative;">
                    <div style="position: absolute;left: 0;top: 0;width: 100%;height: 100%;padding:0 15px;z-index: 99;" id="iframe" class="hidden">
                        <div class="box" style="width: 100%;height: 100%;border-radius: 5px;overflow: hidden;">
                            <iframe src="https://www.taobao.com" frameborder="0" style="width: 100%;height: 100%;"></iframe>
                        </div>
                    </div>
                    <div class="col-sm-4" style="padding-right:0">
                        <div class="jumbotron" style="margin:0;height: 100%;">
                            <ul class="list-group list-group-flush">
                                <?php if(is_array($list) || $list instanceof \think\Collection || $list instanceof \think\Paginator): $i = 0; $__LIST__ = $list;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
                                <li class="list-group-item " style="background:none;"><?php echo htmlentities($vo); ?></li>
                                <?php endforeach; endif; else: echo "" ;endif; ?>
                            </ul>
                        </div>
                    </div>
                    <div class="col-sm-4">
                        <div class="jumbotron" style="margin:0;height: 100%;">
                            <ul class="list-group list-group-flush">
                                <?php if(is_array($list) || $list instanceof \think\Collection || $list instanceof \think\Paginator): $i = 0; $__LIST__ = $list;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
                                <li class="list-group-item " style="background:none;"><?php echo htmlentities($vo); ?></li>
                                <?php endforeach; endif; else: echo "" ;endif; ?>
                            </ul>
                        </div>
                    </div>
                    <div class="col-sm-4" style="padding-left:0">
                        <div class="jumbotron" style="margin:0;height: 100%;">
                            <ul class="list-group list-group-flush">
                                <?php if(is_array($list) || $list instanceof \think\Collection || $list instanceof \think\Paginator): $i = 0; $__LIST__ = $list;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
                                <li class="list-group-item " style="background:none;"><?php echo htmlentities($vo); ?></li>
                                <?php endforeach; endif; else: echo "" ;endif; ?>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script>
<script>
    window.onload = function() {
        connect();
    };
    // 如果浏览器不支持websocket，会使用这个flash自动模拟websocket协议，此过程对开发者透明
    WEB_SOCKET_SWF_LOCATION = "/static/admin/assets/swf/WebSocketMain.swf";
    // 开启flash的websocket debug
    WEB_SOCKET_DEBUG = true;

    var ws, name, client_list = {};

    var connectNums = 0;
    // 连接服务端
    function connect() {
        // console.log(connectNums);
        //重连超过15次后不在链接
        if (connectNums > 15) {
            return false;
        }
        connectNums++;
        //域名
        var baseurl = document.domain;
        // 创建websocket
        ws = new WebSocket("ws://kaifaposssocket.hljmdd.cn:7272");
        // 当socket连接打开时，输入用户名
        ws.onopen = onopen;
        // 当有消息时根据消息类型显示不同信息
        ws.onmessage = onmessage;
        ws.onclose = function() {
            console.log("连接关闭，定时重连");
            connect();
        };
        ws.onerror = function() {
            console.log("出现错误");
        };
    }
    // 连接建立时发送登录信息
    function onopen() {
        var name = "name";
        var user_id = "1";

        // 登录
        var login_data = {
            type: "login_client",
            client_name: name.replace(/"/g, '\\"'),
            user_id: user_id
        };
        console.log(login_data);
        ws.send(JSON.stringify(login_data));

    }


    // 服务端发来消息时
    function onmessage(e) {
        // console.log(e.data);
        var data = eval("(" + e.data + ")");
        layer.msg(JSON.stringify(data), {
            offset: 'rt',
            // closeBtn: true,
            time: 5000
        });
        switch (data['type']) {
            // 服务端ping客户端
            case 'ping':
                //心跳提示
                var data = {
                    type: 'pong'
                }
                ws.send(JSON.stringify(data));
                console.log(data);
                break;
            case 'login_client':
                console.log(data);
                break;
                // 用户退出 更新用户列表
            case 'logout':
                // say(data['from_client_id'], data['from_client_name'], data['from_client_name'] + ' 退出了', data['time'], data['ide']);
                delete client_list[data['from_client_id']];
        }
    }
</script>
    <script>
        loading();

        function loading() {
            // console.log(11);
            // var index = layer.load(1, {
            //     shade: [11, '#fff'] //0.1透明度的白色背景
            // });
        }
        var winheight = document.documentElement.clientHeight;

        $('#container').css({
            'height': winheight - 0 + 'px',
            'minHeight': winheight - 0 + 'px',
            'overflow': 'auto',
            'paddingBottom': '20px',
            'paddingTop': '20px',
        });

        $('#home').click(function() {
            // $('#iframe iframe').attr('src', 'http://www.baidu.com')
            $('#iframe').toggle('hidden');
        })
    </script>
</body>

</html>